
$(function () {
  let form = layui.form;
  // ***********************加载用户列表
  $.ajax({
    url: 'admin/users',
    type: 'GET',
    data: {
      pagenum: 1,
      pagesize: 5
    },
    success: function (res) {
      if (res.status == 0) {
        let str = '';
        console.log(res.data);
        res.data.forEach(item => {

          str += `<tr>
          <td>${item.id}</td>
          <td>${item.username}</td>
          <td>${item.nickname}</td>
          <td>${item.email}</td>
          <td>
            <button type="button" class="layui-btn layui-btn-xs ">
              <a style="color: #fff" target="iframeArea" href="./edit.html">编辑</a>
            </button>
            <button type="button" class="layui-btn layui-btn-xs layui-btn-danger delete">删除</button>
            <button type="button" class="layui-btn layui-btn-xs layui-btn-normal delete">重置密码</button>
          </td>
        </tr>`
        })
        $('tbody').html(str)
      }

    }
  })





  // ************************删除用户






  // ***********************根据id查找用户


  $('.search').on('submit', function (e) {
    e.preventDefault();
    let userid = form.val('search');
    $.ajax({
      type: "get",
      url: `admin/users/:${userid.id}`,
      success: function (response) {
        console.log(response);
        $('tbody').empty();
        let str = `
            <tr>
            <td>${response.data.id}</td>
            <td>${response.data.username}</td>
            <td>${response.data.nickname}</td>
            <td>${response.data.email}</td>
            <td>
              <button type="button" class="layui-btn layui-btn-xs ">
                <a style="color: #fff" target="iframeArea" href="./edit.html?id=${response.data.id}">编辑</a>
              </button>
              <button type="button" class="layui-btn layui-btn-xs layui-btn-danger delete">删除</button>
              <button type="button" class="layui-btn layui-btn-xs layui-btn-normal delete">重置密码</button>
            </td>
          </tr>`;
        $('tbody').html(str);
      }
    });
  });








  // ***********************重置密码的form表单和功能
  let id;
  let str = `<form id="repwd-form" class="layui-form" style="margin: 15px 30px 0 0" lay-filter="formDemo">
      <!-- 第一行：密码 -->
      <div class="layui-form-item">
        <label class="layui-form-label">密码</label>
        <div class="layui-input-block">
          <input type="text" name="password" required lay-verify="required" placeholder="请输入新密码" autocomplete="off" class="layui-input">
        </div>
      </div>
      <!-- 第二行：确认密码 -->
      <div class="layui-form-item">
        <label class="layui-form-label">确认密码</label>
        <div class="layui-input-block">
          <input type="text" required lay-verify="required" placeholder="请重复输入新密码" autocomplete="off" class="layui-input">
        </div>
      </div>
      <!-- 第三行：按钮 -->
      <div class="layui-form-item">
        <div class="layui-input-block">
          <button class="layui-btn" lay-submit >提交</button>
          <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
      </div>
    </form>`;
  $('button.delete').click(function (e) {
    e.preventDefault();
    let id = $(this).parent().siblings()[0];
    id = $(id).text();
    layer.open({
      type: 1,
      content: str //这里content是一个普通的String
    });
    $('form').on('submit', function (e) {
      e.preventDefault();
      let data = form.val('formDemo');
      console.log(data);
      $.ajax({
        type: "put",
        url: `admin/users/:${id}`,
        data: data,
        success: function (response) {
          console.log(response);
        }
      });
    });
  });
});



